<template>
    <div class="assistant">
        <div v-show='allFindShow' class="allFindBox">
       	<p class="detailTop">
	    	<span class="topD">·</span>
	    	所有发现
	    	<span class="topD">·</span>
    	</p>
       	<ul
	        v-if="!showTips"
	        v-infinite-scroll="loadMore"
	        infinite-scroll-disabled="loading"
	        infinite-scroll-distance="20"
	      >
	        <li v-for="(item, index) in allFindList" :key="item.index">
                <div class="rfContent" @click="goDetailInfo(item.id,item.group_name)">
                    <p class="rfInfo">{{item.group_name}},{{item.sender}}对{{item.hit_words}}感兴趣</p>
                    <p>{{item.create_time | formatDate}}</p>
                    <span class="iconSpan">></span>
                </div>
	        </li>
	        <li class="loading_warp" v-show="isShowLoadingIcon">
	          <div class="msg_loading">
	            <img src="http://assets.rurushishi.com/activies/zdfzh/icon_loading.png" alt>
	          </div>
	        </li>
	        <li class="no_more_data" v-show="!isShowLoadingIcon">没有更多数据了</li>
      </ul>
      	<p v-show="isAllFindList" class="noDataShow">暂无数据!</p>
        </div>
    </div>
</template>
<script>
import request from "@/utils/request";
import axios from "axios";
import Cookies from "js-cookie";
import Qs from "qs";
//require("echarts/map/js/china.js");
export default {
    data(){
        return {
//      	isShow:[true, false, false, false],
//      	topText:this.$route.query.name,
			allFindShow:true,
			allFindList:[],
			showTips: false,
					pageNo: 1,
					openId: Cookies.get("openid"),
// openId: 'oj3y9wG78VUHc9lcn-f-nE60_NOM',
	      	isShowLoadingIcon: true,
	      	isAllFindList:false
        }
    },
    filters: {
	    formatDate: function(value) {
	      let date = new Date(value);
	      let y = date.getFullYear();
	      let MM = date.getMonth() + 1;
	      MM = MM < 10 ? "0" + MM : MM;
	      let d = date.getDate();
	      d = d < 10 ? "0" + d : d;
	      let h = date.getHours();
	      h = h < 10 ? "0" + h : h;
	      let m = date.getMinutes();
	      m = m < 10 ? "0" + m : m;
	      let s = date.getSeconds();
	      s = s < 10 ? "0" + s : s;
//	      return y + "-" + MM + "-" + d + " " + h + ":" + m + ":" + s;
		  return y + "-" + MM + "-" + d + " " + h + ":" + m;
	    }
	},
    methods: {
    	//  	点击跳转
    	goDetailInfo(id,name){
    		this.$router.push({path:'/detailInfo',query:{id:id,name:name}})
    	},
    	loadMore() {
	      this.loadData();
	    },
	    loadData() {
	      const _self = this;
	      _self.loading = true;
	      _self.allFindPage(_self.pageIndex).then(function(response) {
	      	console.log(response)
	        if (response.data.totalCount <= 0) {
	          _self.showTips = true;
	          _self.loading = true;
	          _self.isAllFindList = true
	        } else {
	          _self.pageNo++;
	          _self.showTips = false;
	          _self.loading = false;
	          _self.allFindList = _self.allFindList.concat(response.data.list);
	          if (
	            _self.allFindList.length >= response.data.totalCount ||
	            _self.pageNo >= response.data.totalPage
	          ) {
	            //无更多数据
	            _self.loading = true;
	            _self.isShowLoadingIcon = false;
	          }
	        }
	      });
	    },
	    allFindPage(pageNo) {
	      	let _self = this;
	        let query = {
                openId: _self.openId,
                pageNo:_self.pageNo
           }
	      return new Promise(function(resolve, reject) {
	        request
	          .post(
	            `${_self.global.API_AI_FORUM_URL}/assistant/messag/allHits/?${Qs.stringify(query)}`,
	            {}
	          )
	          .then(function(data) {
	            resolve(data);
	          });
	      });
	    }
    },
    mounted(){

    }
}
</script>
<style lang="stylus" scoped>
.assistant{
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    width:100%;
}
.detailTop {
  height: 1.08rem;
  line-height: 1.08rem;
  width: 100%;
  text-align: center;
  font-size: 0.3rem;
}
.topD{
	font-weight: bolder;
	font-size: .3rem;
	color: #f5ad49;
}
.rfContent{
	width: 90%;
	margin: 0 auto;
	position: relative;
	margin-top: .2rem;
	border-bottom: 1px solid #CACACA;
}
.rfContent p{
	width: 80%;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	font-size: .24rem;
	line-height: .4rem;
	color: #CACACA;
}
.rfContent p.rfInfo{
	color: #f4ac48;
}
.iconSpan{
	position: absolute;
	right: 0;
	top: .2rem;
	font-size: .4rem;
	color: #8d8d8d;
}
.allFindBox{
	width: 100%;
	height: 100%;
}
.allFindBox ul{
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	overflow-y: auto;
  	-webkit-overflow-scrolling: touch;
}
.no_more_data {
  border-bottom: none !important;
  color: black;
  width: 100%;
  text-align: center;
  justify-content: center;
  padding-top: 20px;
  padding-bottom: 10px;
}
.noDataShow{
	width: 100%;
	text-align: center;
	line-height: 1rem;
}
</style>


